<template>
    <div>
<table class="table table-bordered bg-primary">
    <tbody>
        <tr>
            <td>游戏</td>
            <td>时长</td>
        </tr>
        <tr>
            <td>Apex</td>
            <td>1352</td>
        </tr>
        <tr v-for="item in arrobj":key="item.id">
            <td>{{item.name}}</td>
            <td>{{item.time}}</td>
        </tr>
    </tbody>

</table>
<hr>
,<select>
    <option value="">请选择</option>
    <option v-bind:value="item.id" v-for="item in City":key="item.id">{{item.name}}</option>
</select>
    </div>
</template>

<script setup lang="ts">
import { ref,reactive } from 'vue';
let arrobj=reactive([
    {id:1,name:'守望先锋',time:12321},
    {id:2,name:'泰坦陨落',time:13121},
    {id:3,name:'英雄联盟',time:4343},
    {id:4,name:'瓦洛兰特',time:4342},
])

let City=reactive([
    {id:1,name:'河南'},
    {id:2,name:'河北'},
    {id:3,name:'山东'},
    {id:4,name:'山西'}
])
</script>

<style scoped>

</style>